<!DOCTYPE html>
<html lang="en">
<head>
    <title>代理商体系</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<#assign basePath=request.contextPath>
    <title>后台管理系统</title>
<#include "/WEB-INF/views/template/bootMainCss.ftl" parse=true encoding="utf-8">
    <link href="${basePath}/bootstrap/plugin/validator/popover.css" rel="stylesheet">
    <link href="${basePath}/bootstrap/css/form.lzy.css" rel="stylesheet">
    <link rel="stylesheet" href="${basePath}/bootstrap/css/jquery.treegrid.css">
    <style>
        .verify-tip {
            display: none;
            margin-top: 5px;
            margin-bottom: 10px;
            color: #a94442;
            font-size: 85%;
        }
        .form-control, .input-group .form-control{ width: 100%;}
        .level{ width: 30%; display: inline-block; margin: 0 0 5px 10px;}
        .lin{display: inline-block;}
    </style>
</head>
<body>
<div class="panel panel-lzy">
    <div class="panel-body">
        <h5 class="tips-lzy">操作提示</h5>
        <ul class="tips-list-lzy">
            <li>◆&nbsp;<span>该页面可根据不同销售部门或对外销售渠道设置对应的主体体系，针对不同主体体系，协议可以有不同的分佣设置和一些权限设置。</span></li>
        </ul>
    </div>
</div>
<div class="content">
    <div class="row" style="margin: 15px 0 0 0;">
        <div class="col-lg-4">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <button id="add-dept" class="btn btn-xs btn-primary btn-create">
                        <span class="fa fa-plus"></span> 新增主体
                    </button>
                </div>
                <div id="dept-sub-list" class="panel panel-default ">
                    <div class="panel-body">
                        <table class="tree table table-hover v-middle table-striped table-condensed" id="dataTables-depts">
                            <thead>
                            <tr>
                                <th data-field="name" data-call="true">&nbsp;&nbsp;&nbsp;&nbsp;主体信息</th>
                                <th data-field="button" data-call="true" style="width: 180px; text-align: center;">&nbsp;&nbsp;&nbsp;&nbsp;操作</th>
                            </tr>
                            </thead>
                            <tbody id="tbody"></tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-4">
            <div id="dept-detail" class="panel panel-default" style="display: none">
                <div class="panel-heading">
                    新增主体
                </div>
                <div class="panel-body">
                    <form id="dept-form" name="dept-form" role="form" class="form-horizontal" enctype="multipart/form-data">
                        <input type="hidden" id="deptId" name="id" value="">
                        <#--<input type="hidden" id="enabled" name="enabled" value="true">-->
                            <input type="hidden" name="level" value="1">
                            <input type="hidden" name="higherId" value="0">
                        <div class="form-group">
                            <label for="deptCode" class="col-sm-3 control-label">主体简称：</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="deptCode" name="shortName"
                                       placeholder="请填写主体简称" maxlength="10">
                                <span class="verify-tip">主体简称已存在,请更换主体简称!</span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="deptName" class="col-sm-3 control-label">主体名称：</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="deptName" name="name"
                                       placeholder="请填写主体名称" maxlength="10">
                                <span class="verify-tip">主体名称已存在,请更换主体名称!</span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="deptSort" class="col-sm-3 control-label">主体序号：</label>
                            <div class="col-sm-9">
                                <div class="input-group">
										<span class="input-group-btn">
											<input type="text" class="form-control" id="deptSort" name="serial"
                                                   placeholder="主体序号" maxlength="6">
										</span>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="remark" class="col-sm-3 control-label">主体介绍：</label>
                            <div class="col-sm-9">
                                <textarea class="form-control" id="remark" name="introduce" rows="2"
                                          placeholder="主体介绍" maxlength="100"></textarea>
                            </div>
                        </div>
                        <hr/>
                        <div class="form-group">
                            <div class="col-sm-offset-4 col-sm-8">
                                <button type="button" class="btn btn-primary paper-shadow relative" id="btn-save"
                                        onclick="submitForm();">提交
                                </button>
                                <button type="button" class="btn btn-default" id="btn-return">关闭</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

            <div id="add-system" class="panel panel-default" style="display: none">
                <div class="panel-heading">
                    新增体系
                </div>
                <div class="panel-body">
                    <form id="system-form" name="dept-form" role="form" class="form-horizontal" method="POST"
                          action="${basePath}/admin/dept/create" enctype="multipart/form-data">
                        <input type="hidden" id="higherId" name="higherId" value="">
                        <input type="hidden" name="level" value="2">
                        <input type="hidden" id="id" name="id" value="">
                        <div class="form-group">
                            <label for="deptCode" class="col-sm-3 control-label">体系简称：</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="txCode" name="shortName"
                                       placeholder="请填写主体简称" maxlength="10" onblur="checkDeptCode()">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="deptName" class="col-sm-3 control-label">体系名称：</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="txName" name="name"
                                       placeholder="请填写主体名称" maxlength="10" onblur="checkDeptName()">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="deptSort" class="col-sm-3 control-label">业务销售员：</label>
                            <div class="col-sm-9" id="saleMan">
                                <label><input type="radio" name="isSalesman" value="1" checked> 是</label>
                                <label><input type="radio" name="isSalesman" value="0"> 否</label>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="remark" class="col-sm-3 control-label">体系介绍：</label>
                            <div class="col-sm-9">
                                <textarea class="form-control" id="txRemark" name="introduce" rows="2"
                                          placeholder="主体介绍" maxlength="100"></textarea>
                            </div>
                        </div>
                        <hr/>
                        <div class="form-group">
                            <div class="col-sm-offset-4 col-sm-8">
                                <button type="button" class="btn btn-primary paper-shadow relative" id="tx-save"
                                        onclick="systemForm();">提交
                                </button>
                                <button type="button" class="btn btn-default" id="tx-return">关闭</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<style>
    .modal-box {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: 999;
    }

    .modal-content {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -260px;
        margin-top: -300px;
        width: 520px;
    }
</style>

<input type="hidden" id="systemIdSss" value="1">
<input type="hidden" id="_ctx" value="<%=request.getContextPath()%>">
<#include "/WEB-INF/views/template/bootMainJs.ftl" parse=true encoding="utf-8">
<script type="text/javascript" src="${basePath}/bootstrap/js/jquery.treegrid.js"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/bootstrap-validator/0.5.3/js/bootstrapValidator.min.js"></script>
<script type="text/javascript">
    $(window).bootstrapValidator || document.write('<script src="${basePath}/bootstrap/js/bootstrapValidator.min.js"><\/script>');
</script>
<SCRIPT type="text/javascript">
    $(function () {
        $('#dataTables-depts').treegrid({
            data:'${basePath}/admin/agent/system/queryAgentSystem',
            initialState: 'collapse',
            removeCss: false,
            ifSelectOne:true,
            expanderExpandedClass: 'glyphicon glyphicon-triangle-bottom',
            expanderCollapsedClass: 'glyphicon glyphicon-triangle-right'
        });
    })

    function tableCallBack(data,id){
        if(id=='name'){
            var temp = '';
            if(data.level==1){
                temp += data.name
            }
            else{
                temp += "<span style='padding-left:30px'>"+data.name+"</span>"
            }
            return temp;
        }
        else if(id == 'button') {
            var _button = '';
            _button += '<div style="width:180px; text-align: right">';
            if(data.level==1){
                _button += '<button type="button" class="btn btn-primary btn-xs" onclick="addView('+data.id+')">新增体系</button> ';
            }

            _button += '<button type="button" class="btn btn-primary btn-xs" onclick="deptView('+data.id+','+data.level+')">查看</button> ';
            _button += '<button type="button" class="btn btn-primary btn-xs" onclick="editMeal('+data.id+','+data.level+','+data.higherId+')">编辑</button>';
            _button += '</div>';
            return _button;
        }
        else {
            if(data[id] == null || data[id] == ''){
                return '';
            }else{
                return data[id];
            }
        }
    }

    var type = 1; //1主体 2体系
    var dtail = $("#dept-detail");
    dtail.hide();
    var aSystem = $("#add-system");

    //详情
    function deptView(id,objType){
        $("#dept-form").data("bootstrapValidator").resetForm();
        $("#system-form").data("bootstrapValidator").resetForm();
        type = objType;
        $("#btn-save").hide();
        $("#tx-save").hide();
        $("form .form-group input").each(function(){
            $(this).prop("disabled","true")
        })
        $("form .form-group textarea").prop("disabled","true");
        getData(id);
    }

    function getData(id){
        if(type==1){
            dtail.show();
            aSystem.hide();
        }
        else if(type==2){
            aSystem.show();
            dtail.hide();
        }

        $.ajax({
            type: "GET",
            url: "${basePath}/admin/agent/system/queryAgentSystemById?id="+id,
            data:{},
            dataType: 'json',
            success: function(data){
                if(type==1){
                    $("#deptId").val(data.result.id);
                    $("#deptCode").val(data.result.shortName);
                    $("#deptName").val(data.result.name);
                    $("#deptSort").val(data.result.serial);
                    $("#remark").val(data.result.introduce);
                }
                else if(type==2){
                    $("#txCode").val(data.result.shortName);
                    $("#txName").val(data.result.name);
                    $("#txRemark").val(data.result.introduce);
                    if(data.result.isSalesman==0){
                        $("#saleMan label input").eq(1).attr("checked","checked")
                    }
                    else{
                        $("#saleMan label input").eq(0).attr("checked","checked")
                    }
                }
            },
            error: function(){
                console.log("请求失败")
            }
        })
    }

    var submitType = 1;//新增
    //编辑
    function editMeal(id,objType,higherId){
        $("#dept-form").data("bootstrapValidator").resetForm();
        $("#system-form").data("bootstrapValidator").resetForm();
        type = objType;
        $("#id").val(id);
        $("#higherId").val(higherId);
        $("form .form-group input").each(function(){
            $(this).removeAttr("disabled")
        })
        $("form .form-group textarea").removeAttr("disabled");
        $("#btn-save").show();
        $("#tx-save").show();
        getData(id);
        submitType = 2;//修改
    }

    function systemForm(){
        var url;
        if(submitType == 1){
            url = '${basePath}/admin/agent/system/createAgentSystem'
        }
        else{
            url = '${basePath}/admin/agent/system/updateAgentSystem'
        }
        var bsVal = $("#system-form").data('bootstrapValidator');
        bsVal.validate();
        if (bsVal.isValid() && $(".verify-tip:visible").length == 0) {
            $.ajax({
                method: 'GET',
                dataType: 'json',
                url: url,
                data: $("#system-form").serialize(),
                success: function (data) {
                    if (data.code == '0') {
                        layer.alert('操作成功', {
                            icon: 1
                        }, function () {
                            window.location.reload();
                        });
                    } else {
                        layer.alert(data.desc, {
                            icon: 5
                        });
                    }
                }
            });
        }
    }

    function submitForm() {
        var url;
        if(submitType == 1){
            url = '${basePath}/admin/agent/system/createAgentSystem'
        }
        else{
            url = '${basePath}/admin/agent/system/updateAgentSystem'
        }
        var bsVal = $("#dept-form").data('bootstrapValidator');
        bsVal.validate();
        if (bsVal.isValid() && $(".verify-tip:visible").length == 0) {
            $.ajax({
                method: 'GET',
                dataType: 'json',
                url: url,
                data: $("#dept-form").serialize(),
                success: function (data) {
                    if (data.code == '0') {
                        layer.alert('操作成功', {
                            icon: 1
                        },function(){
                            window.location.reload();
                        });
                    } else {
                        layer.alert(data.desc, {
                            icon: 5
                        });
                    }
                }
            });
        }
    }

    //表单验证
    $('#dept-form').bootstrapValidator({
        fields: {
            name: {
                validators: {
                    notEmpty: {
                        message: '请输入主体名称'
                    }
                }
            },
            serial: {
                validators: {
                    notEmpty: {
                        message: '请输入主体序号'
                    },
                    regexp: {
                        regexp: regInt,
                        message: '请输入正整数'
                    }
                }
            },
        }
    });
    $('#system-form').bootstrapValidator({
        fields: {
            name: {
                validators: {
                    notEmpty: {
                        message: '请输入体系名称'
                    }
                }
            },
            isSalesman:{
                validators: {
                    notEmpty: {
                        message: '请选择业务销售员'
                    }
                }
            }
        }
    })

    //检查主体简称唯一
    function checkDeptCode() {
        var obj = $('#deptCode');
        var val = obj.val();
        if (val == "" || $.trim(val) == "") {
            return false
        }
        else {
            $.ajax({
                type: 'GET',
                url: '${basePath}/admin/dept/select/deptCode',
                dataType: 'json',
                data: {
                    id: $("#deptId").val() || null,
                    deptCode: val
                },
                success: function (data) {
                    var btn = $("button.btn-success");
                    var small = obj.siblings(".verify-tip");
                    if (data.code == 1) {
                        small.show().css("display", "block");
                        btn.prop("disabled", "true");
                        return false;
                    }
                    else {
                        small.hide();
                        btn.removeProp("disabled");
                    }
                }
            });
        }
    }

    //检查主体名称唯一
    function checkDeptName() {
        var obj = $('#deptName');
        var val = obj.val();
        if (val == "" || $.trim(val) == "") {
            return false
        }
        else {
            $.ajax({
                type: 'GET',
                url: '${basePath}/admin/agent/system/queryAgentSystem',
                dataType: 'json',
                data: {
                    id: $("#deptId").val() || null,
                    deptName: val
                },
                success: function (data) {
                    var btn = $("button.btn-success");
                    var small = obj.siblings(".verify-tip");
                    if (data.code == 1) {
                        small.show().css("display", "block");
                        btn.prop("disabled", "true");
                        return false;
                    }
                    else {
                        small.hide();
                        btn.removeProp("disabled");
                    }
                }
            });
        }
    }


    //新增体系
    function addView(obj){
        submitType = 1;
        $("form .form-group input").not("input[type=radio]").each(function(){
            $(this).val("").removeAttr("disabled")
        })
        $("form .form-group textarea").val("").removeAttr("disabled");
        $("#tx-save").show();
        $("#higherId").val(obj);
        dtail.hide();
        aSystem.show();
    }

    //页面事件
    $("#btn-return").click(function () {
        dtail.hide();
    });
    $("#tx-return").click(function () {
        aSystem.hide();
    });
    $("#add-dept").click(function () {
        submitType = 1;
        $("#dept-form .form-group input").each(function(){
            $(this).val("").removeAttr("disabled")
        })
        $("#dept-form textarea").val("").removeAttr("disabled");
        $("#btn-save").show();

        dtail.show();
        aSystem.hide();
        $("#btn-select-dept").click(function () {
            var mbox = $(".modal-box");
            var curVal, curId;
            //取值
            $("#modal-tree a").each(function () {
                $(this).click(function () {
                    curVal = $(this).attr("title");
                    curId = $(this).attr("data-id");
                    console.log(curId)
                })
            });
            mbox.show();
            var mbtn = $(".modal-footer button");
            mbtn.eq(0).click(function () {
                //赋值
                $("#parentName").html(curVal);
                $("#parentId").val(curId);
                mbox.hide();
            });
            mbtn.eq(1).click(function () {
                mbox.hide();
            });
            $(".modal-header .close").click(function () {
                mbox.hide();
            })
        })
    })

</script>
</body>
</html>
